import React, { Component, createContext } from 'react'
// 1.创建 跨组件的 上下文对象，大驼峰
const NameContext = createContext()
class Third extends Component {
  // 3.获取数据 - contextType --- 只适用于类组件
  static contextType = NameContext

  render () {
    return (
      <div>
        33333 - 
        {/* 4.可以直接通过 this.context 获取到数据 */}
        { this.context }
      </div>
    )
  }
}
const Second = (props) => {
  return (
    <div>
      222222
      <Third/>
    </div>
  )
}
class First extends Component {
  render () {
    return (
      <div>
        1111
        <Second/>
      </div>
    )
  }
}
export default class App extends Component {
  render() {
    return (
      <div>
        {/* 2.顶级组件中通过 上下文对象 下的 Provider 组件 配合 value 属性传值 */}
        <NameContext.Provider value = "传家宝1">
          <First />
        </NameContext.Provider>
      </div>
    )
  }
}
